<template>
  <Carousel v-model="value1" loop style="height: 1080px; width: 1920px; margin: 0px auto; ">
    <CarouselItem>
      <div class="demo-carousel"><img alt="top-pic2" src="../../assets/top-pic/top-pic1.jpg"></div>
    </CarouselItem>
    <CarouselItem>
      <div class="demo-carousel"><img alt="top-pic2" src="../../assets/top-pic/top-pic2.jpg"></div>
    </CarouselItem>
    <CarouselItem>
      <div class="demo-carousel"><img alt="top-pic3" src="../../assets/top-pic/top-pic3.jpg"></div>
    </CarouselItem>
    <CarouselItem>
      <div class="demo-carousel"><img alt="top-pic4" src="../../assets/top-pic/top-pic4.jpg"></div>
    </CarouselItem>
  </Carousel>
</template>

<script>
export default {
  data () {
    return {
      value1: 0
    }
  }
}
</script>

<style scoped>
*{
  margin: 0px;
  border: 0px;
  padding: 0px;
}
Carousel {
  margin: 0 auto;
}
</style>
